<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<div class="place-order margin-all padding-vertical">
	<h1>Place an Order</h1>
  		<form action="/dms/set-order-payment.html" name="dms-place-order-form" class="form formalize" method="post">
    		<div class="section">
    			<div class="title float-left full-width padding-vertical">
    				<div class="float-left margin-left font-16 font-white capitalize">1. <fmt:message key="msg.from"/></div>
    			</div>
	    		<div class="input-item">
		    		<label><fmt:message key="msg.company"/></label>
		    		<input type="text" value="${order.sender.companyName }" name="sender.companyName" class="text-field" placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.company"/>' ${param.mode}/>
	    		</div>
	    		<div class="clear-both"></div>
				<div class="input-item">
		    		<label class="required"><fmt:message key="msg.first-name"/></label>
		    		<c:set var="firstName" value="${order.sender.firstName}"/>
		    		<c:if test="${empty firstName}"><c:set var="firstName" value="${user.firstName}"/></c:if>
		    		<input type="text" value="${firstName}" name="sender.firstName" class="text-field required" placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.first-name"/>' ${param.mode}/>
	    		</div>
	    		<div class="clear-both"></div>
	    		
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.last-name"/></label>
		    		<c:set var="lastName" value="${order.sender.lastName}"/>
		    		<c:if test="${empty lastName}"><c:set var="lastName" value="${user.lastName}"/></c:if>
		    		<input type="text" value="${user.lastName}" name="sender.lastName" class="text-field required" placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.last-name"/>' ${param.mode}/>
	    		</div>
	    		<div class="clear-both"></div>
	    		
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.address-1"/></label>
		    		<c:set var="addressLine1" value="${order.sender.source.addressLine1}"/>
		    		<c:if test="${empty addressLine1}"><c:set var="addressLine1" value="${user.residentAddress.addressLine1}"/></c:if>
		    		<input type="text" value="${addressLine1}" name="sender.source.addressLine1" class="text-field required" placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.address"/>' ${param.mode}/>
	    		</div>
	    		<div class="input-item">
		    		<label><fmt:message key="msg.address-2"/></label>
		    		<c:set var="addressLine2" value="${order.sender.source.addressLine2}"/>
		    		<c:if test="${empty addressLine2}"><c:set var="addressLine2" value="${user.residentAddress.addressLine2}"/></c:if>
		    		<input type="text" value="${addressLine2}" name="sender.source.addressLine2" class="text-field" placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.address"/>' ${param.mode}/>
	    		</div>
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.city"/></label>
		    		<c:set var="city" value="${order.sender.source.city}"/>
		    		<c:if test="${empty city}"><c:set var="city" value="${user.residentAddress.city}"/></c:if>
		    		<input type="text" value="${city}" name="sender.source.city" class="text-field required" placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.city"/>' ${param.mode}/>
	    		</div>
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.state"/></label>
		    		<c:set var="state" value="${order.sender.source.state}"/>
		    		<c:if test="${empty state}"><c:set var="state" value="${user.residentAddress.state}"/></c:if>
		    		<input type="text" value="${state}" name="sender.source.state" class="text-field required" placeholder='<fmt:message key="msg.input-your"/> <fmt:message key="msg.state"/>' ${param.mode}/>
	    		</div>
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.zip-code"/></label>
		    		<c:set var="zip" value="${order.sender.source.zip}"/>
		    		<c:if test="${empty zip}"><c:set var="zip" value="${user.residentAddress.zip}"/></c:if>
		    		<input type="text" value="${zip}" name="sender.source.zip" class="text-field digits required" minlength="5" maxlength="5" placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.zip-code"/>' ${param.mode}/>
	    		</div>
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.phone-number"/></label>
		    		<c:set var="phoneNumber" value="${order.sender.phoneNumber}"/>
		    		<c:if test="${empty phoneNumber}"><c:set var="phoneNumber" value="${user.phoneNumber}"/></c:if>
		    		<input type="text" value="${phoneNumber}" name="sender.phoneNumber" class="text-field required " placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.cell-phone"/>' ${param.mode}/>
	    		</div>	   		
	   		</div>
	   		<div class="clear-both"></div>
    		<div class="section">
    			<div class="title float-left full-width padding-vertical">
    				<div class="float-left margin-left font-16 font-white capitalize">2. <fmt:message key="msg.to"/></div>
    			</div>
	    		<div class="input-item">
		    		<label><fmt:message key="msg.company"/></label>
		    		<input type="text" value="${order.recipient.companyName }" name="recipient.companyName" class="text-field" placeholder='<fmt:message key="msg.recipient"/> <fmt:message key="msg.company"/>' ${param.mode}/>
	    		</div>
	    		<div class="clear-both"></div>
				<div class="input-item">
		    		<label class="required"><fmt:message key="msg.first-name"/></label>
		    		<input type="text" value="${order.recipient.firstName }" name="recipient.firstName" class="text-field required" placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.first-name"/>' ${param.mode}/>
	    		</div>
	    		<div class="clear-both"></div>
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.last-name"/></label>
		    		<input type="text" value="${order.recipient.lastName }" name="recipient.lastName" class="text-field required" placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.last-name"/>' ${param.mode}/>
	    		</div>
	    		<div class="clear-both"></div>
	    		
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.address-1"/></label>
		    		<input type="text" value="${order.recipient.destination.addressLine1 }" name="recipient.destination.addressLine1" class="text-field required" placeholder='<fmt:message key="msg.recipient"/> <fmt:message key="msg.address"/>' ${param.mode}/>
	    		</div>
	    		<div class="input-item">
		    		<label><fmt:message key="msg.address-2"/></label>
		    		<input type="text" value="${order.recipient.destination.addressLine2}" name="recipient.destination.addressLine2" class="text-field" placeholder='<fmt:message key="msg.recipient"/> <fmt:message key="msg.address"/>' ${param.mode}/>
	    		</div>
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.city"/></label>
		    		<input type="text" value="${order.recipient.destination.city }" name="recipient.destination.city" class="text-field required" placeholder='<fmt:message key="msg.recipient"/> <fmt:message key="msg.city"/>' ${param.mode}/>
	    		</div>
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.state"/></label>
		    		<input type="text" value="${order.recipient.destination.state }" name="recipient.destination.state" class="text-field required" placeholder='<fmt:message key="msg.recipient"/> <fmt:message key="msg.state"/>' ${param.mode}/>
	    		</div>
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.zip-code"/></label>
		    		<input type="text" value="${order.recipient.destination.zip }" name="recipient.destination.zip" class="text-field digits required" minlength="5" maxlength="5" placeholder='<fmt:message key="msg.recipient"/> <fmt:message key="msg.zip-code"/>' ${param.mode}/>
	    		</div>
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.phone-number"/></label>
		    		<input type="text" value="${order.recipient.phoneNumber }" name="recipient.phoneNumber" class="text-field required " placeholder='<fmt:message key="msg.recipient"/> <fmt:message key="msg.cell-phone"/>' ${param.mode}/>
	    		</div>	   		
	   		</div>
	   		<div class="clear-both"></div>
    		<div class="section">
    			<div class="title float-left full-width padding-vertical">
    				<div class="float-left margin-left font-16 font-white capitalize">3. <fmt:message key="msg.package"/> &amp; <fmt:message key="msg.shipment"/></div>
    			</div>
					<div class="input-item margin-horizontal-dbl margin-top">
						<div id="add-a-package" class="block margin-left-half font-white btn btn-success float-left"><i class="icon-plus-sign-alt"></i> 
							<span>Add a package</span>
						</div>
							<c:set var="packagesCount" value="${fn:length(order.packages)}"/> 
							<c:if test="${empty packagesCount or packagesCount eq 0}"><c:set var="packagesCount" value="1"/></c:if> 		
							<div class="total-packages margin-left-dbl margin-top-half float-left font-13 padding-horizontal padding-vertical-half">Total: <span class="count">${packagesCount}</span></div>
	    			</div>
		    		<div class="clear-both"></div>    			
		    		<span id="package-list">
		    			<c:choose>
		    				<c:when test="${not empty order.packages and fn:length(order.packages) gt 0}">
					    		<c:forEach items="${order.packages}" var="package" varStatus="status">
					    			<c:set var="pkg" value="${package}" scope="request"/>
									<jsp:include page="/WEB-INF/modules/package-template.jsp" flush="true">
										<jsp:param name="idx" value="${status.index}"/>
										<jsp:param name="count" value="${status.count}"/>
										<jsp:param name="packagesCount" value="${packagesCount}"/>
									</jsp:include>
								</c:forEach>
					    			<c:remove var="pkg" scope="request"/>
		    				</c:when>
		    				<c:otherwise>
									<jsp:include page="/WEB-INF/modules/package-template.jsp" flush="true">
										<jsp:param name="idx" value="0"/>
										<jsp:param name="count" value="1"/>
										<jsp:param name="packagesCount" value="1"/>
									</jsp:include>
		    				</c:otherwise>
		    			</c:choose>
	    		</span>
				
	    		<div class="clear-both"></div>
		    	<c:forEach items="${order.schedulePickupDateList}" var="pkpDateObj" varStatus="status">
		    		<c:if test='${pkpDateObj.valid}'>
		   	    		<div class="input-item">
				    		<label class="required">Pickup Date/Time</label>
				    		<input type="text" value="<fmt:formatDate value='${pkpDateObj.pickupDateScheduled}' pattern='MM/dd/yyyy hh:mm'/>" name="schedulePickupDateList.pickupDateScheduled" class="text-field required date dateNotInPast" placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.shipping-date"/>'/>
			    		</div>
			    		<div class="clear-both"></div> 		
		    		</c:if>
	    		</c:forEach>	
	    		<div class="input-item">
		    		<label class="required"><fmt:message key="msg.shipping-date"/></label>
		    		<input type="text" value='<fmt:formatDate value='${order.shippingDate}' pattern='MM/dd/yyyy'/>' name="shippingDate" class="text-field required date dateNotInPast" placeholder='<fmt:message key="msg.input-your"/><fmt:message key="msg.shipping-date"/>'/>
	    		</div>
	    		<div class="clear-both"></div>
	    		<div class="input-item">
		    		<label><fmt:message key="msg.service-type"/></label> 
		    		<select name="order.serviceType" size="1" id="order-serviceType" class="float-left required">
			    		<option value="">Choose Service Type</option>
						<option value="0" <c:if test='${order.serviceType eq 0}'>selected</c:if>>Ground</option>
						<option value="1"  <c:if test='${order.serviceType eq 1}'>selected</c:if>>1Day Freight</option>
						<option value="2"  <c:if test='${order.serviceType eq 2}'>selected</c:if>>2Day Freight</option>
						<option value="3"  <c:if test='${order.serviceType eq 3}'>selected</c:if>>3Day Freight</option>
					</select> 
	    		</div>
	   		</div>
	   		<div class="clear-both"></div>
    		<div class="margin-left-dbl ${param.mode}">
    		<input type="submit" value='Next'/>	   		
    		<input type="reset" value='<fmt:message key="msg.reset"/>'/>	   		
    		</div>
  		</form>
</div>

	<div id="package-temp">
		<jsp:include page="/WEB-INF/modules/package-template.jsp" flush="true">
			<jsp:param name="packagesCount" value="1"/>
		</jsp:include>
	</div>

  <script type="text/javascript" src="/dms/javascript/place-an-order.js"></script>